<template>
    <div class="add-plan-view">

      <el-form ref="form" :inline="true" :model="data" class="demo-form-inline" label-width="100px" size="medium" label-position="left" :rules="rules">
        <el-form-item label="工作内容" prop="work_content">
          <div class="textarea">
            <el-input
              clearable
              v-model="data.work_content"
              placeholder="请输入工作内容"
              type="textarea"
              :rows="2">
            </el-input>
          </div>

        </el-form-item>
        <el-form-item label="开始日期" prop="startTime">
          <el-date-picker
            clearable
            @change="startChange"
            v-model="data.startTime"
            type="date"
            :editable="false"
            :clearable="false"
            placeholder="请选择开始日期"
            :picker-options="pickerOptions">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="结束日期" prop="endTime">
          <el-date-picker
            clearable
            @change="endChange"
            v-model="data.endTime"
            type="date"
            :editable="false"
            :clearable="false"
            placeholder="请选择结束日期"
            :picker-options="pickerOptions">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="所属项目" prop="project_id">
          <el-select v-model="data.project_id" placeholder="请选择所属项目" @change="projectChange" clearable>
            <el-option
              v-for="item in projectList"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="所属任务" prop="task_id">
          <el-select v-model="data.task_id" placeholder="请选择所属任务"  @change="taskChange" clearable>
            <el-option
              v-for="item in list"
              :key="item.id"
              :label="item.task_name"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>

<!--        <el-form-item label="所属项目" >-->
<!--          <span>{{data.project_message}}</span>-->
<!--        </el-form-item>-->

        <el-form-item label="执行人" prop="executor_id">
          <el-select v-model="data.executor_id" placeholder="请选择执行人" @change="peopleChange" clearable>
            <el-option
              v-for="item in members"
              :key="item.member_id"
              :label="item.member_name"
              :value="item.member_id">
            </el-option>
          </el-select>
        </el-form-item>



        <!--        <el-form-item label="项目信息">-->
        <!--          <el-input v-model="data.project_message"></el-input>-->
        <!--        </el-form-item>-->

        <!--        <el-form-item label="任务信息">-->
        <!--          <el-input v-model="data.task_message"></el-input>-->
        <!--        </el-form-item>-->

      </el-form>

    </div>
</template>

<script>
  import {projectName} from "../../../../api/sampleInspection";

  export default {
        name: "addPlanView",
        props:{
            taskList:Array,
        },
        data:function () {
            return{
                list:[],
                data:{
                    work_content:'',
                    startTime:'',
                    endTime:'',
                    project_id:'',
                    project_message:'',
                    task_id:'',
                    task_message:'',
                    executor_id:'',
                    executor:'',
                },
                members:[],
                pickerOptions: {
                    disabledDate:time=> {
                        if (time.toLocaleDateString() == new Date().toLocaleDateString()){
                            return false
                        }
                        return time.getTime() < new Date().getTime();
                    }
                },
                rules: {
                    work_content: [
                        { required: true, message: '请输入工作内容', trigger: 'blur' }
                    ],
                    startTime: [
                        { type: 'date', required: true, message: '请选择开始日期', trigger: 'change' }
                    ],
                    endTime: [
                        { type: 'date', required: true, message: '请选择结束日期', trigger: 'change' }
                    ],
                    executor_id: [
                        { required: true, message: '请选择执行人', trigger: 'change' }
                    ],
                    task_id:[
                        { required: true, message: '请选择任务', trigger: 'change' }
                    ],
                    project_id:[
                        { required: true, message: '请选择项目', trigger: 'change' }
                    ],
                },
                projectList:[],
            }
        },
        mounted:function(){


            projectName({
                project_status: [6, 7, 61, 62, 63, 64,72]
            }).then(res=>{
                if (res.code === 200) {

                    if (res.data.data){
                        res.data.data.forEach(item=>{
                            let phases = ""
                            if (item.project_phases_id == "1"){
                                phases = "临床前研究"
                            }else{
                                phases = "临床研究"
                            }
                            item.name = item.project_name + '(' + phases + ')'
                        })

                        this.projectList = res.data.data || [];
                    }
                }
            });

            // this.$api.PROJECT_START_PROJECT_LIST_ONGOING().then(res=>{
            //     if (res.code == 200){
            //         this.projectList = res.data;
            //     }
            // }).catch(err=>{
            //
            // })
        },
        methods:{
            startChange:function () {
                if (this.data.endTime){
                    if (this.data.startTime.getTime() > this.data.endTime.getTime()){
                        this.data.endTime = "";
                        this.$message.error("结束时间不能早于开始时间")
                    }
                }
            },
            endChange:function () {
                if (this.data.startTime){
                    if (this.data.startTime.getTime() > this.data.endTime.getTime()){
                        this.data.endTime = "";
                        this.$message.error("结束时间不能早于开始时间")
                    }
                }
            },
            peopleChange:function (id) {
                if (id){
                    let index = this.members.findIndex(a=>a.member_id == id)
                    if (index != -1){
                        let pel = this.members[index];
                        this.data.executor_id = pel.member_id;
                        this.data.executor = pel.member_name;
                    }
                }else{
                    this.data.executor_id = '';
                    this.data.executor = '';
                }

            },
            taskChange:function (id) {
                if (id){
                    let index = this.list.findIndex(a=>a.id == id)
                    if (index != -1){
                        let pel = this.list[index];
                        this.data.task_id = pel.id;
                        this.data.task_message = pel.task_name;
                        // this.data.project_id = pel.project_id;
                        // this.data.project_message = pel.project_name;
                        console.log('sdasdasdasdasdas    ',this.data.task_id)
                        if (this.$store.getters.userInfo.user.id == pel.person_in_charge.member_id){
                            this.members = pel.task_member;
                        }else {
                            let index1 = pel.task_member.findIndex(a=>a.member_id == this.$store.getters.userInfo.user.id)
                            if (index1 != -1){
                                this.members = [pel.task_member[index1]]
                            }else {
                                this.members = []
                            }
                        }

                        if (this.members.length && this.members.length == 1){
                            this.data.executor_id = this.members[0].member_id
                            this.data.executor = this.members[0].member_name
                        }
                        // this.members = pel.task_member;
                    }
                }else {
                    this.data.task_id = ""
                    this.data.task_message = ""
                    this.data.executor_id = '';
                    this.data.executor = '';
                }

                console.log(this.data)

            },
            projectChange:function (id) {

                if (id){
                    let index = this.projectList.findIndex(a=>a.id == id)
                    if (index != -1){
                        let prj = this.projectList[index]

                        this.data.project_id = prj.id;
                        this.data.project_message = prj.project_name;

                        this.data.task_id = ""
                        this.data.task_message = ""

                        this.getTaskTree(prj.id)
                    }
                }else {
                    this.data.project_id = '';
                    this.data.project_message = '';

                    this.data.task_id = ""
                    this.data.task_message = ""

                    this.data.executor_id = '';
                    this.data.executor = '';
                }

            },
            getTaskTree:function(id){
                this.$api.PROJECT_START_TASK_PROJECT_TREE({project_id:id}).then(res=>{
                    if (res.code == 200){
                        this.list = []
                        this.dealData(res.data ? res.data : [])
                    }
                })
            },
            dealData:function(list){
                for (let i = 0; i < list.length; i++){
                    let data = list[i];

                    if (data.status == 1 || data.status == 4 || data.status == 5){
                        this.list.push(data)
                    }

                    if (data.children && data.children.length){
                        this.dealData(data.children)
                    }
                }
            },
            formValidate:function () {
                return this.$refs.form.validate()
            }
        }
    }
</script>

<style lang="scss" scoped>
  @import "@/assets/scss/views/projectManagement/list/details/addPlanView.scss";
</style>
